<template>
	<view class="title">
		<view class="form">
		    <view class="tit">登录</view>
			<input class="input" v-model="userInfo.username" placeholder="请输入用户名"/>
		   <input class="input" v-model="userInfo.password"  placeholder="请输入密码"/>
		  
		   <button  class="btn" type="primary" @click="handlelogin">登录</button>
		   <view class="link">
			   <text>没有账号?</text>
			   <navigator url="/pages/regis/regis" style="color: #428AF6;">去注册</navigator>
		   </view>
		</view>
		
	</view>
</template>

<script> 
	export default {
		data() {
			
			return {
			userInfo: {
				
			    username: '',
			    password: ''
			}
			}
		},
		
		methods: {
handlelogin(){
	if(!this.userInfo.username || !this.userInfo.password){
		uni.showToast({
			title:'请输入完整信息',
			icon:'none'
			
		})
		return

	}
	if(this.userInfo.username==='ljp' && this.userInfo.password==='122512023046'){
		uni.showToast({
			title:'登入中...'
		})
		setTimeout(()=>{
			uni.hideLoading()
			uni.showToast({
				title:'登入成功'
			})
		uni.switchTab({
			url:"/pages/tarBar/compont/compont"
		})
			
			
		},1000)
	}else{
		uni.showToast({
			title:'密码错误，请重新输入'
		});
		
		
	}
	
	
}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
<style >
	.form{
border-style:solid;
		margin: 100px 20px;
		border-color: ghostwhite;
		border-width: 8rpx;
		border-radius: 16rpx;
		padding: 50px 0px;

	}
	.tit{
		font-size: 47rpx;
		font-weight: bold;
		color: black;
		text-align: center;	
	}
	.input{
	margin: 20rpx 40rpx;

height: 45rpx;
		position: relative;
padding: 3px;
		align-items: center;
	border-color: ghostwhite;
	border-style:solid;
	border-width: 3rpx;
	border-radius: 5rpx;

		
		
	}
	.btn{
		margin: 0 40rpx;
	}
	.link{
	
		margin: 20rpx 40px;
		font-size: 20rpx;
		display: flex;
		text-align: center;
		justify-content: center;
	}
</style>
